body{
  background-color: rgb(202, 186, 166)

}
.main_container{
  display: grid;
  grid-template-rows:  1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr;
  grid-template-areas:
    "h1"
    "genre_description"
    "book1"
    "book2"
    "book3"
    "book4"
    "book5"
    "book6"
    "book7"
    "book8"
    "book9"
    "book10"
    "gototop_button";

  gap: 15px;
}
h1 {
  grid-area: h1;
  font-size: 3em;
  text-align: center;
  background-image: url("genre background/common bg.jpg");
  max-height:50px ;
  background-size:cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 50px;
  margin:0;
  color:bisque


}

#genre_description {
  grid-area: genre_description;
  /* margin-top:40px ; */

}
#genre_description p{
  font-size: 1.5em;
  font-style: oblique;

}
.book1 {
  grid-area: book1;
}

.book2 {
  grid-area: book2;
}

.book3 {
  grid-area: book3;
}

.book4 {
  grid-area: book4;
}

.book5 {
  grid-area: book5;
}

.book6 {
  grid-area: book6;
}

.book7 {
  grid-area: book7;
}

.book8 {
  grid-area: book8;
}

.book9 {
  grid-area: book9;
}

.book10 {
  grid-area: book10;
}


.book-container{
  display: flex;
  align-items: center;
  justify-content: left;
  gap: 0px;
  /* flex-direction: column; */
  /* margin-left: 700px; */
  background-color:rgb(174, 160, 144);
  /* margin-left: 30px;
  margin-right: 30px; */

}

.book-container p {
  margin: 0px; 
}

.book-container img {
  max-height: 100px;
  object-fit:contain;
}
p{
  font-weight: bold;
  font-size: 1.5em;
}
.gototop_button p{
  /* background-color: white; */
  font-size: 2em;
  text-align: center;
}